<template>
  <div class="content">
    <button class="left">点击</button>
    <button class="right">点击</button>
  </div>
</template>

<script>

export default {
  name: '',
  data () {
    return {
      
    }
  },
  methods:{
  
}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.content{
  position: relative;
  color: #fff;
  width: 100%;
  height: 150px;
  background-color: blueviolet;
}
.left{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-100%);
}
.right{
  position: absolute;
  top: 0;
  right: 50%;
  transform: translate(100%); 
}

</style>